<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>

  <style>
    .main {
      width: 200px;
      height: auto;
    }

    .main ul li {
      padding: 10px 5px;
      background-color: rgb(255, 235, 235);
      margin: 5px 0px;
    }
  </style>
</head>

<body>
  <!-- <div class="main">
    <ul class="ul">
      <li>1</li>
      <li>2</li>
      <li>3</li>
      <li>4</li>
      <li>5</li>
      <li>6</li>
    </ul>
  </div> -->

  <button id="is_login">登 陆</button>

  <script>
    function logArgs() {
      console.log(arguments);
      console.log(arguments[2]);
      console.log(...arguments);
    };
    // logArgs("a", "b", 4, { words: "hello" })

    // let arr = [10, 8, 3, 2, 35, 45, 54]
    // console.log(arr.splice(1, "11", "22", "33"));

    // console.log(arr);
    // let arr2 = ['a', 'b', 'c', 'd']

    // let arr3 = [...arr, ...arr2];
    // console.log(arr.concat(arr, arr2));
    // console.log(arr3);

    // let str = 'you li ah joi'

    // let params = {
    //   age: 1,
    //   name: 'nick'
    // }
    // console.log(str.split(' ', 10));

    // console.log(arr.length = 10);
    // console.log(arr.sort());
    // console.log(arr);
    // let str2 = str.split('')
    // console.log(str2);

    // var a = 10;
    // function app() {
    //   var b = 2;
    //   var d = 3;
    //   function add() {
    //     return c = a + b;
    //   }
    //   return add;
    // }
    // var x = app();
    // console.log(x());


    // var liList = document.getElementsByTagName('li')
    // for (var i = 0; i < 6; i++) {
    //   (function (j) {
    //     console.log(j);
    //     liList[j].onclick = function () {
    //       alert( j + 1 ) 
    //     }
    //   })(i)
    // }

    // function fn() {
    //   let n = 123;
    //   return function fn2() {
    //     console.log(n);
    //   }
    // }

    // let res = fn()
    // console.log(res());
    // res()


    // var name = "The Window";

    // var object = {
    //   name: "My Object",
    //   getNameFunc: function () {
    //     console.log(this);
    //     return function () {
    //       console.log(this);
    //       return this.name;
    //     };
    //   }
    // };

    // alert(object.getNameFunc()());


    // 防抖函数

    /**
     * @function debounce 函数防抖
     * @param {Function} fn 需要防抖的函数
     * @param {Number} interval 间隔时间
     * @return {Function} 经过防抖处理的函数
     * 
     */

    function login() {
      console.log('登陆');
    };

    // function debounce(fn, interval) {
    //   let timer = null; // 定时器
    //   return function () {
    //     // 清除上一次的定时器
    //     clearTimeout(timer);
    //     // 拿到当前的函数作用域
    //     let _this = this;
    //     // 拿到当前函数的参数数组
    //     let args = Array.prototype.slice.call(arguments, 0);
    //     // 开启倒计时定时器
    //     timer = setTimeout(function () {
    //       // 通过apply传递当前函数this，以及参数
    //       fn.apply(_this, args);
    //       // 默认300ms执行
    //     }, interval || 300)
    //   }
    // }

    function debounce(fn, delay = 300, immediate) {
      let timer = null;
      return function () {
        const context = this;
        const args = arguments;

        timer && clearTimeout(timer);

        // 等价于
        // if (timer) {
        //   clearTimeout(timer);
        //   timer = null;
        // }

        // if (immediate) {
        //   const doNow = !timer;

        //   timer = setTimeout(() => {
        //     timer = null;
        //   }, delay);

        //   doNow && fn.apply(context, args);
        // } else {
        timer = setTimeout(() => {
          fn.apply(context, args);
        }, delay);
        // }
      };
    }

    let btn = document.getElementById('is_login');
    btn.addEventListener('click', debounce(this.login, 1000))


    // function debounce(fn, delay = 300) {
    //   let timer = null;

    //   return function () {
    //     const context = this;
    //     const arg = arguments;

    //     timer && clearTimeout(timer);

    //     timer = setTimeout(() => {
    //       fn.apply(context, args)
    //     }, delay);
    //   }
    // }
    var run = false;
    const promise = new Promise(function (resolve, reject) {
      // console.log('start');
      // if (run) {
      //   console.log(true);
      //   resolve('ssssssss');
      // } else {
      //   console.log(false);
      //   reject('erererererer');
      // }
      // console.log('end');
    });

    // promise.then(res => {
    //   console.log(res);
    // }).catch(error => {
    //   console.log(error);
    // })

    setTimeout(function () {
      console.log('定时器开始啦')
    });

    new Promise(function (resolve) {
      console.log('马上执行for循环啦');
      for (var i = 0; i < 10000; i++) {
        i == 99 && resolve();
      }
    }).then(function () {
      console.log('执行then函数啦')
    });

    console.log('代码执行结束');

  </script>
</body>

</html>